<template>
  <a-modal v-model="showModal" @ok="confirmOk" @cancel="cancel" title="编辑" width="450px">
    <a-spin :spinning="loading">
      <a-form :form="form">
        <a-row :gutter="[24, 0]">
          <a-col :span="20">
            <a-form-item class="mb-15" label="类目名称" :label-col="labelCol" :wrapper-col="wrapperCol">
              <a-input
                placeholder="请输入"
                v-decorator="[
                  'label',
                  {
                    rules: [{ required: true, message: '请输入', whitespace: true }],
                  },
                ]"
                maxLength="30"
                disabled
              ></a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row :gutter="[24, 0]">
          <a-col :span="20">
            <a-form-item class="mb-15" label="说明" :label-col="labelCol" :wrapper-col="wrapperCol">
              <a-textarea
                placeholder="请输入"
                rows="4"
                :max-length="500"
                v-decorator="[
                  'remark',
                  {
                    rules: [{ required: true, message: '请输入', whitespace: true }],
                  },
                ]"
              ></a-textarea>
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>
    </a-spin>
  </a-modal>
</template>
<script>
import { updateDataType } from '@/api/newPet'
export default {
  data() {
    return {
      loading: false,
      isShow: true,
      labelCol: {
        span: 8,
      },
      wrapperCol: {
        span: 16,
      },
      showModal: false,
      titles: '新增',
      info: {},
      form: this.$form.createForm(this),
    }
  },
  methods: {
    cancel() {
      this.form.resetFields()
      this.showModal = false
    },
    confirmOk() {
      this.form.validateFields((err, values) => {
        if (!err) {
          this.loading = true
          const { info } = this
          let data = {
            id: info && info.id ? info.id : undefined,
            ...this.$utils.trimValue(values),
            value: values.label,
            sort: 1,
            remark: values.remark.toString(),
            dictType: this.info.dictType,
            status: 1,
          }
          updateDataType(data)
            .then((res) => {
              this.$message.success('修改成功！')
              this.$emit('success')
              this.cancel()
            })
            .finally(() => {
              this.loading = false
            })
        }
      })
    },
    open(data) {
      this.showModal = true
      this.info = data
      this.$nextTick(() => {
        this.form.setFieldsValue({
          ...data,
          status: data.status == 0 ? true : false,
        })
      })
    },
  },
}
</script>
<style lang="less" scoped>
</style>
